extends layout

block head
  link(
    rel="stylesheet" 
    href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css" 
    integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" 
    crossorigin="anonymous"
  )
  link(
    rel="stylesheet"
    href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.15.8/styles/default.min.css"
  )
  script(
    src="https://cdn.bootcss.com/jquery/3.2.1/jquery.slim.min.js" 
    integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" 
    crossorigin="anonymous"
  )
  script(
    src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"
    crossorigin="anonymous"
  )
  script(
    src="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/js/bootstrap.min.js" 
    integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" 
    crossorigin="anonymous"
  )
block header 
  include header
block content
  div(class="container")
    h1=title
    //- 文件渲染内容
    if file
      div!=file.text
    //- 目录渲染内容
    else
      table(class = "table table-hover table-bordered")
        tr
          th="类型"
          th="名字"
          th="命令"
        each val, index in pathList
          tr(title = val.name)
            td
              span(
                class=(val.type == '目录' ? "glyphicon glyphicon-folder-open" : "glyphicon glyphicon-open-file")
                style="color:#a73789e6"
              )
            td(title = val.children)
              a(href=val.path)=val.name 
            td(class="commands")
              button(
                type="button" 
                class="btn code btn-info dropdown-toggle btn-xs" 
                aria-haspopup="true" 
                aria-expanded="false"
                data-url=val.path || val.name
              )="code"
              button(
                type="button" 
                class="btn open btn-info dropdown-toggle btn-xs" 
                aria-haspopup="true" 
                aria-expanded="false"
                data-url=val.path || val.name
              )="open"
       
  script.
    $('button.code').click(function(event){
      $.ajax({
        url:$(this).data('url'),
        type:'post',
        data:{
          command:'code'
        }
      })
    })
    $('button.open').click(function(event){
      $.ajax({
        url:$(this).data('url'),
        type:'post',
        data:{
          command:'open'
        }
      })
    })

    $(document.body).keydown(function(event){
      switch(event.code){
        case 'ArrowLeft':
          if(location.pathname != '/'){
            history.back();
          }
        break;
        case 'ArrowRight':
          history.go(1);
        break;
      }
    })